<template>
    <div :class="classes">
        <div :class="barConClasses">
            <i :class="`${prefix}-bar`" v-once v-for="i in 8" :key="`trigger-${i}`"></i>
        </div>
    </div>
</template>

<script>
export default {
    name: 'Trigger',
    props: {
        mode: String
    },
    data() {
        return {
            prefix: 'ivu-split-trigger',
            initOffset: 0
        }
    },
    computed: {
        isVertical() {
            return this.mode === 'vertical'
        },
        classes() {
            return [this.prefix, this.isVertical ? `${this.prefix}-vertical` : `${this.prefix}-horizontal`]
        },
        barConClasses() {
            return [`${this.prefix}-bar-con`, this.isVertical ? 'vertical' : 'horizontal']
        }
    }
}
</script>

<style lang="less">
@import './index.less';
</style>
